<script setup lang="ts">
import { pointApi } from '@/api'
import type { CascaderProps } from 'element-plus'

const props = withDefaults(defineProps<{
  cprops?: CascaderProps
}>(), {
  cprops() {
    return {}
  },
})
const value = defineModel<any>({ required: true })
const options = ref<any[]>([])
const cascaderProps = computed<CascaderProps>(() => {
  return {
    checkStrictly: true,
    expandTrigger: 'hover',
    emitPath: false,
    label: 'pointName',
    value: 'id',
    ...props.cprops,
  }
})

async function getOptions(needFullName: 0 | 1 = 0) {
  try {
    const { data } = await pointApi.loadRoleEnergyUnit(needFullName)
    options.value = data.list || []
  }
  catch (e) {}
}

onMounted(() => {
  getOptions()
})
</script>

<template>
  <ElCascader v-model="value" :options="options" :props="cascaderProps" :clearable="true" :empty-values="[undefined]" :value-on-clear="() => {}" v-bind="$attrs" />
</template>
